<template>
	<view>
		<view class="un-money-tou">
			<view class="un-money-tou-text">{{user.NAME}}</view>
			
		</view>
		
		<view class="un-money-item">
			<view class="un-money-item1">
				<text class="un-money-item-text1">{{money}}</text>
				<text class="un-money-item-text2">元</text>
				<text class="clamp un-money-item-text3">可使用资金</text>
				<text class="clamp un-money-item-text4" @click="navTo('/pagesun/recharge/recharge')">充值</text>
			</view>
			<view class="un-money-item2">
				<text class="un-money-item-text1">{{money}}</text>
				<text class="un-money-item-text2">元</text>
				<text class="clamp un-money-item-text3">可转出资金</text>
				<text class="clamp un-money-item-text5" @click="togglePopup('tack')">提现</text>
			</view>
			
		</view>
		
		<view class="line" >
			<!-- <list-cell icon="iconfont icon-a4" iconColor="#9D9D9D" title="银行签约"   @eventClick="navTo('/pages/bankcard/bankcard')"  ></list-cell> -->
			<list-cell icon="iconfont icon-zijin" iconColor="#9F9F9F" title="余额记录"   @eventClick="navTo('/pagesun/moneyRecord/moneyRecord')"  ></list-cell>
			<list-cell icon="iconfont icon-hcongzhi" iconColor="#9F9F9F" title="充值记录"   @eventClick="navTo('/pages/money/rechargeRecord/rechargeRecord')"  ></list-cell>
			<list-cell icon="iconfont icon-tixian" iconColor="#9D9D9D" title="提现记录"   @eventClick="navTo('/pages/money/withdrawalRecord/withdrawalRecord?isOut=1')" ></list-cell>
			<!-- <list-cell icon="iconfont icon-tixian" iconColor="#9D9D9D" title="交易记录"   @eventClick="navTo('/pages/money/withdrawalRecord/withdrawalRecord?isOut=2')" ></list-cell> -->
			<list-cell icon="iconfont icon-suo1" iconColor="#9D9D9D" title="修改支付密码" @eventClick="navTo('/pages/money/changeMonryPw/changeMonryPw')"></list-cell>
		</view>
		
		
		<uni-popup  :show="type=='add'" type="middle" >
			<form class="form"  @submit="formSubmit">
				<view class="login_form">
					<view class="pwd">充值</view>
					<view class="un-bei">
						<view class="">备注：</view>
						<view class="">1、填写汇款账户与实际汇款账户必须一致，否则充值失败；</view>
						<view class="">2、填写需要充值金额与实际充值的金额必须一致，否则充值失败；</view>
						<view class="">由于违反以上两条而造成的不便或相关责任自行承担。</view>
					</view>
					<view class="un-ti">请输入充值金额：</view>
					<view class="input">
						<input type="text" name="money"  :value="money1" placeholder="请输入">
					</view>
				</view>
				<button class="submit" type="primary"  formType="submit" >确定</button>
				
			</form>
			<view class="yticon icon-fork badge" @click="togglePopup('')"></view>
		</uni-popup>
		<uni-popup  :show="type=='tack'" type="middle" >
			<form class="form"  @submit="formSubmit1" style="height: 300upx;width: 450upx;">
				<view class="login_form">
					<view class="pwd">请输入提现金额</view>
					<view class="input">
						<input type="text" name="money"  :value="money1" placeholder="金额">
					</view>
				</view>
				<button class="submit" type="primary"  formType="submit" >确定</button>
			</form>
			<view class="yticon icon-fork badge un-a" @click="togglePopup('')" style="top: 70upx;left: 400upx;"></view>
		</uni-popup>
	</view>
</template>

<script>
	import listCell from '@/components/mix-list-cell';
	import uniPopup from '@/components/uni-popup/uni-popup.vue';
	var  graceChecker = require("../../common/graceChecker.js");
	import {  mapState  } from 'vuex'; 
	export default {
		components: {
			listCell,
			uniPopup
		},
		data(){
			return {
				money : '',
				type: '',
				money1:'',
				user:{},
			}
		},
		onLoad(){
			// this.loadData()
			this.loadInfo()
			// this.loadLog()
			uni.startPullDownRefresh();
		},
		onPullDownRefresh() {
			console.log('refresh');
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onShow() {
			this.loadData();
			// this.loadRecord()
		},
		watch:{
		},
		computed: {
			...mapState(['hasLogin','userInfo']),
		},
		methods: {
			navTo(url){
				if(!this.hasLogin){
					url = '/pages/public/login1';
				}
				uni.navigateTo({  
					url,
				})  
			}, 
			togglePopup(type){
				if(type===''){
					this.money1 = ''
				}
				this.type = type;
			},
			loadInfo(){
				this.$http.post('/user/info',{
					SIGNATURE : uni.getStorageSync("SIGNATURE"),
					TOKEN: uni.getStorageSync("userInfo").TOKEN,
				}).then((res1)=>{
					//判断返回内容
					if(res1.data.STATE === "0" && res1.statusCode === 200){
						console.log("666666666666",res1);
						this.user = res1.data.OBJECT
					}
				})
				.catch((err1)=>{
					console.log('request fail', err1);
				})
			},
			async loadData(){
				this.$http.post('/user/findMoney',{
					SIGNATURE : uni.getStorageSync("SIGNATURE"),
					TOKEN: uni.getStorageSync("userInfo").TOKEN,
					// PAYTOKEN:uni.getStorageSync("userInfo").TOKENP,
				}).then((res1)=>{
					//判断返回内容
					if(res1.data.STATE === "0" && res1.statusCode === 200){
						this.money = res1.data.OBJECT
					}else if((res1.statusCode === 200) && (res1.data.STATE === '-1')){
						
						// if(res1.data.MSG.split("]")[1].split("[")[0] === '登录凭证已失效，请重新登录'){
							uni.switchTab({
								url:'/pages/user/user'
							})
						// }else{
						// 	uni.showToast({
						// 		title: res1.data.MSG,
						// 		icon: "none",
						// 	})
						// }
					}else{
						uni.showToast({
							title: res1.data.MSG,
							icon: "none",
						})
					}
				})
				.catch((err1)=>{
					console.log('request fail', err1);
				})
			},
			//领取充值奖励
			async loadRecord(){
				
				this.$http.post('/user/rechargeAward',{
					SIGNATURE : uni.getStorageSync("SIGNATURE"),
					TOKEN: uni.getStorageSync("userInfo").TOKEN,
					TOKENP:uni.getStorageSync("userInfo").TOKENP,
				}).then((res)=>{
					//判断返回内容
					if(res.data.STATE === "0" && res.statusCode === 200){
						uni.showToast({
							title:"领取成功",
							icon:"none"
						})
					}else{
						uni.showToast({
							title:res.data.MSG,
							icon:"none"
						})
					}
				})
				.catch((err)=>{
					console.log('request fail', err);
				})
						
			},
			// async loadLog(){
			// 	this.$http.post('/user/orderstate',{
			// 		SIGNATURE : uni.getStorageSync("SIGNATURE"),
			// 		TOKEN: uni.getStorageSync("userInfo").TOKEN,
			// 		PAYTOKEN:uni.getStorageSync("userInfo").TOKENP,
			// 	}).then((res1)=>{
			// 		//判断返回内容
			// 		if(res1.data.STATE === "0" && res1.statusCode === 200){
			// 			console.log(">>>>>>>>>>>>",res1)
			// 		}else if((res1.statusCode === 200) && (res1.data.STATE === '-1')){
			// 			if(res1.data.MSG.split("]")[1].split("[")[0] === '登录凭证已失效，请重新登录'){
			// 				uni.switchTab({
			// 					url:'/pages/user/user'
			// 				})
			// 			}
			// 		}
			// 	})
			// 	.catch((err1)=>{
			// 		console.log('request fail', err1);
			// 	})
			// 	
			// 	
			// 	
			// },
			formSubmit(e){
				console.log("6666666111111")
				this.$http.post('/user/createOrder',{
					SIGNATURE : uni.getStorageSync("SIGNATURE"),
					TOKEN: uni.getStorageSync("userInfo").TOKEN,
					TOKENP: uni.getStorageSync("userInfo").TOKENP,
					ORDERTYPE: 1,
					MONEY: e.detail.value.money,
				}).then((res1)=>{
					console.log("6666666111111.....")
					if(res1.data.STATE == '903'||res1.data.STATE == '904'){
						uni.navigateTo({
							url:'/pages/public/login1'
						})
					}
					//判断返回内容
					if(res1.data.STATE === "0" && res1.statusCode === 200){
						
						console.log("6666666111111",res1)
						//#ifdef H5
						
						window.location.href = res1.data.OBJECT
						// uni.redirectTo({
						// 	url:res1.data.OBJECT
						// })
						//#endif
					}
				})
				.catch((err1)=>{
					console.log('request fail', err1);
				})
			},
			//提现
			formSubmit1(e){
				if(e.detail.value.money>this.money ){
					uni.showToast({
						title:"余额不足",
						icon:"none"
					})
				}if(e.detail.value.money == 0){
					
				}else{
					this.$http.post('/user/giveOut',{
						SIGNATURE : uni.getStorageSync("SIGNATURE"),
						TOKEN: uni.getStorageSync("userInfo").TOKEN,
						MONEY: e.detail.value.money,
					}).then((res1)=>{
						if(res1.data.STATE == '903'||res1.data.STATE == '904'){
							uni.navigateTo({
								url:'/pages/public/login1'
							})
						}
						//判断返回内容
						if(res1.data.STATE === "0" && res1.statusCode === 200){
							console.log("66666662222",res1)
							uni.showToast({
								title:"申请成功",
								icon:"none"
							})
							this.togglePopup('')
						}
					})
					.catch((err1)=>{
						console.log('request fail', err1);
					})
				}
			},
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #F5F5F5;
	}
	.form{
		background-color: #f5f5f5;
		width: 600upx;
		height: 600upx;
		border-radius: 4%;
		border: 2upx solid #9F9F9F;
		padding:20upx 0upx;
		.login_form{
			margin: 20upx;
			padding-left: 30upx;
			padding-right: 30upx;
			.pwd{
				font-size: 35upx;
				font-weight: 900;
				text-align: center;
			}
			.un-bei{
				color: #F04844;
				font-size: 24upx;
				padding: 10upx 0upx;
			}
			.un-ti{
				font-size: 30upx;
				text-align: center;
			}
			.input{
				border: 1upx solid #9F9F9F;
				margin: 20upx 0upx 20upx 0upx;
				height: 60upx;
			}
		}
		
		.submit{
			background-color: #E02E24;
			width: 80%;
		}
	}
	.un-a{
		position: absolute;
		top: 30upx;
		left: 520upx;
		background-color: #999999;
		color: #EBEDF0;
		border-radius: 100%;
	}
	.un-money-tou{
		width: 100%;
		background-color: #E02E24;
		height: 235upx;
		padding: 0upx 30upx;
		position: relative;
		.un-money-tou-text{
			padding-top: 40upx;
			font-size: 50upx;
			color: #fff;
		}
		.un-money-tou-text1{
			line-height: 90upx;
			color: #fff;
			font-size: 25upx;
			width: 100upx;
			text-align: center;
			margin-left: 80upx;
		}
		.un-money-tou-text2{
			text-align: center;
			line-height: 90upx;
			color: #fff;
			width: 33%;
			// margin-left: 120upx;
		}
	}
	.un-money-item{
		position: absolute;
		top:150upx;
		color: #999999; 
		background-color: #fff;
		border-radius: 20upx;
		display: flex;
		padding: 30upx 0upx;
		width: 690upx;
		left: 30upx;
		.un-money-item1{
			width: 50%;
			text-align: center;
			.un-money-item-text4{
				padding: 10upx 0upx;
				border-radius: 10upx;
				border: #E02E24 1upx solid;
				color: #E02E24;
				font-size: 25upx;
				width: 150upx;
				margin-left: 100upx;
			}
		}
		.un-money-item2{
			width: 50%;
			text-align: center;
			.un-money-item-text5{
				padding: 10upx 0upx;
				border-radius: 10upx;
				border: #E02E24 1upx solid;
				color: #FFFFFF;
				background-color: #E02E24;
				font-size: 25upx;
				width: 150upx;
				margin-left: 100upx;
			}
		}
		.un-money-item-text1{
			color: #666666;
		}
		.un-money-item-text2{
			font-size: 25upx;
			margin-left: 10upx;
		}
		.un-money-item-text3{
			font-size: 25upx;
			margin: 10upx 0upx;
		}
	}
	
	.line{
		color: rgb(153, 153, 153); 
		background-color: #fff;
		margin: 160upx 30upx 50upx;
		border-radius: 20upx;
	}
</style>
